<template>
  <el-container>
    <el-header>
      <!-- 按钮 -->
      <div class="left-panel">
        <el-button type="primary" icon="el-icon-plus"></el-button>
        <el-button type="danger" plain icon="el-icon-delete"></el-button>
      </div>
      <!-- 查询界面 -->
    </el-header>
    <el-main class="nopadding">
      <scTable
        ref="table"
        :apiObj="list"
        row-key="id"
        stripe
        :paginationLayout="'prev, pager, next'"
        @selection-change="selectionChange"
      >
        <el-table-column type="selection" width="50"></el-table-column>
        <el-table-column type="index" label="#" width="50" />
        <el-table-column
          label="表单名称"
          prop="ProcessFormName"
          width="150"
        ></el-table-column>
        <el-table-column
          label="表单编码"
          prop="ProcessFormNo"
          width="150"
        ></el-table-column>
        <el-table-column
          label="表单类型"
          prop="ProcessFormType"
          width="150"
        ></el-table-column>
        <el-table-column
          label="创建人"
          prop="CUser"
          width="150"
        ></el-table-column>
        <el-table-column
          label="创建时间"
          prop="CDate"
          width="150"
        ></el-table-column>
        <el-table-column
          label="状态"
          prop="State"
          width="150"
        ></el-table-column>
        <el-table-column fixed="right" label="操作" align="center" width="140">
          <template #default="scope">
            <el-button
              type="primary"
              text
              size="small"
              @click="open(scope.row)"
            >
              编辑
            </el-button>
          </template>
        </el-table-column>
      </scTable>
    </el-main>
  </el-container>
  <vform ref="vformRef" v-if="data.dialog.vformIsHide"></vform>
</template>
<script lang="ts" setup>
import scTable from '@/components/scTable/index.vue';
import Api from '@/api/flow/processForm';

import { reactive, ref, nextTick, unref } from 'vue';
import { useRoute } from 'vue-router';
import { roleData } from '../../setting/role/type';
import { ElMessageBox, ElMessage } from 'element-plus';
import vform from '@/components/VForm/index.vue';
import { useGlobalStore } from '@/store/modules/globalStore';
const vformRef = ref();
const globalStore = useGlobalStore();

const open = (row: any) => {
  data.dialog.vformIsHide = true;
  nextTick(() => {
    vformRef.value.open(row);
  });
};
const list = Api.getlist;
let table = ref('');
const route = useRoute();
let data = reactive<any>({
  selection: [],
  indexName: route.name as any,
  //查询对象
  searchList: {
    roleName: '',
  },
  dialog: {
    save: false,
    permission: false,
    vformIsHide: false,
  },
});
const selectionChange = (selection: any) => {
  data.selection = selection;
};
</script>
